<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%
	String basepath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ request.getContextPath() + "/";
%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<style type="text/css">
.xwgg_button{
	padding-left: 400px;
	width: 670px;
}
.xwgg_button button{
	padding:2px 15px;
	border: 1px solid #9f9c9c;
	background: #93c81e;
	margin-left: 10px;
	color:#fff;
}
.gg{
	width: 750px;
	background: #fafafa;
}
.gg>div{
	border-bottom: 1px solid #ebebeb;
}
.gg>div>p{
	line-height: 40px;
	cursor: pointer;
    font-size:13px;
}
.gg_head>span{
	float: left;
	width: 180px;
}
.gg_head>span.gg_bg{
	width:30px;
	height: 40px;
	float: right;
}
.gg>div .gg_title{
    width: 320px;
    display: block;
    width: 250px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.gg>div>p>b{
	width: 200px;
	text-align: right;
}

.gg button{
	float: left;
	background: #cccaca;
	border: 1px solid #9f9c9c;
	width:75px;
	height: 25px;
	margin-left: 450px;
}
.news_detail{
	display: none;
	background-color: #fff;
	padding: 10px;
    font-size: 12px;
}

.fenlei>ul{
	float: left;
	border: 1px solid #c3c3c5;
	padding-left: 0px;
}
.fenlei>ul>b{
    float: left;
}
.fenlei>ul>li{
	cursor: pointer;
	padding:3px 10px;
	float: left;
	list-style: none;
}
.fenlei>ul .leixing{
	background: #c3c3c5;
	border:1px solid #c3c3c5;
	margin-right: 10px;
	font-size: 12px;
}
#each_div{
	height: 420px;
	overflow-y:scroll;
}
#Editor{
	position: absolute;
	top:10%;
	display: none;
	background-color: #fff;
	z-index: 100;
	padding: 10px;
}
#Editor>form>p{
    line-height: 25px;
    padding-left: 10px;
}

#Editor input.news_sub{
	display: block;
	margin:auto;
	margin-top: 10px;
	cursor: pointer;
  	width: 80px;
  	height: 30px;
  	border-radius: 5px;
  	background-color: #90c624;
  	color: #fff;
  	font-size: 15px;
  	border: 1px solid #ccc;

}
#Editor>form>p>input{
    width:200px;
    height: 18px;
}
#Editor>form>p>select{
    width:200px;
}
#close_div{
	padding: 1px;
	width: 20px;
	height: 20px;
	float: right;
	background-color:#90c624;
	cursor: pointer;
	color: #fff;

}
.change_news{
    float: right;
    padding: 2px 15px;
  	border: 1px solid #9f9c9c;
  	background: #93c81e;
  	margin-right: 10px;
  	color: #fff;     
}
</style>
<div class="body_top">
	<div>
		<p>新闻公告管理</p>
		<div>
			<p>INTRODUUCTION OF INVESTORS</p>
			<p class="last_p">PUSH YOUR BACK REDUCE YOUR TIME</p>
		</div>
	</div>
</div>


<div id="Editor">
	<span id="close_div"></span>
    <form action="admin/addnews" method="post">
    <input type="hidden" value="" name=nid>
    <p><b>标题：</b><input type="text" name="title"></p>
    <p><b>类型：</b>
        <select name="ntid">
        	<c:forEach items="${requestScope.notice }" var="notice">
				<option value ="${notice.nt_id}">${notice.nt_name}</option>
			</c:forEach>
        </select></p>
         <p><b>发布来源:</b><input type="text" name="from" value="创新创业管理中心"></p>
    <script id="editor" type="text/plain"></script>
    <!-- <input type="hidden" name="content" value="" id="content"> -->
    <input type="submit" class="news_sub"value="提交">
    </form>
</div>	


<div class="fenlei clearfix">
    <ul>
		<b>类型：</b>
		<c:forEach items="${requestScope.notice }" var="notice">
		<li class="leixing" title="${notice.nt_id}">${notice.nt_name}</li>
		</c:forEach>
	</ul>
</div>
<div class="xwgg_button">
	<button id="add_news">发布</button>
	<button id="choose_all">多选</button>
	<button class="last_button">删除</button>
</div>
<div id="each_div">
<c:forEach items="${requestScope.lists }" var="list">
	<div class="gg">
		<div>
		
			<p class="gg_head">
				 <span class="gg_title" title="${list.get(0).n_title }"><b>标题：</b>${list.get(0).n_title }</span><span><b>类别:</b>${list.get(2).nt_name != null ? list.get(2).nt_name : '未知' }</span><span><b>时间：</b>
				${list.get(0).n_ctime }</span><input  type="checkbox" name="checkbox" /><span class="gg_bg"><img src="img/ss.png"></span>
			</p>
			<!-- 各新闻公告的ID -->
			<div class="news_detail">
				<p>
					<b>ID：</b><span">${list.get(0).n_id }</span>
				</p>
				<p>
					<b>时间：</b>${list.get(0).n_ctime }
				</p>
				<p>
					<b>发布人：</b>${list.get(1).a_name }
				</p>
				<p>
                    
					<b>内容：</b>
                </p>
                <input class="change_news" type="button" value="修改内容" title="${list.get(0).n_id }">
                <div title="${list.get(2).nt_id }"> ${list.get(0).n_content }</div>
				
			</div>
		</div>
	</div>
</c:forEach>
</div>	
<div class="fy" title="${sum != null?sum:1 }">
			<span id="pre_page">上一页</span>
			<ul>
			</ul>
			<span id="next_page">下一页</span>
</div>
<script type="text/javascript">
UE.delEditor('editor');
var ue = UE.getEditor('editor',{
    initialFrameHeight:520  //初始化编辑器高度,默认320
    ,initialFrameWidth:700
    ,initialStyle:'p{line-height:1em; font-size: 12px; }'
    ,textarea:"content"
 
});
$(document).ready(function(){
	//下滑效果
	$("#each_div").delegate('.gg_head>span','click',function(){
			$(this).parent().next().slideToggle();
		})

    //修改内容
    $("#each_div").delegate('.change_news','click',function(){
       $("#Editor").slideDown(400);
         $(".back_shadow").slideDown(400);
         var content_text =$(this).next().html();
         var news_id=this.title;
         var news_type=$(this).next().attr("title");
         var news_title=$(this).parent().prev().children('.gg_title').attr("title");
         ue.setContent(content_text);
         $("#Editor input[name=nid]").val(news_id);
         $("#Editor input[name=title]").val(news_title);
         $("#Editor select").val(news_type);
    })
 

	//分页
	$(".fy>ul>li").click(function(){
		$(this).css("background","#96c720");
		$(this).children().css("color","#fff");
		$(this).siblings().css({"background":"#fff","color":"#ebebeb"});
	})


	// 点击发布
	$("#add_news").click(function(){
		 $("#Editor").slideDown(400);
         $(".back_shadow").slideDown(400);
	})
	$("#close_div,.back_shadow").click(function(){
            $("#Editor").slideUp(400);
            $(".back_shadow").slideUp(400);
        })
	$("#close_div").click(function(){
			$("#Editor form")[0].reset();
			ue.setContent("辛苦您了！");
	})
	//新闻公告管理中的删除	
		//返回数据 
		$("#choose_all").on('click',function(){
			console.log($("input[type=checkbox]").attr("checked"))
			if($("input[type=checkbox]").attr("checked")=="checked"){
				$("input[type=checkbox]").each(function(){
					$(this).attr("checked", false);  
				})
			}
			else{
				$("input[type=checkbox]").each(function(){
					$(this).attr("checked",true);  
			})
			}
		})
		$(".xwgg_button>.last_button").click(function(){
        	 var isChecked = false; 
        	 isChecked = false;
            $("input[type=checkbox]").each(function(){  
                if(this.checked){
                     
                  var xinwen_id = $(this).parent().next().children().children().eq(1).text();
                  var Data={
                        type:"news",
                        id:xinwen_id
                    }
                var that= $(this);
                    getData("admin/del",delete_new,Data,that)
                     return isChecked=true; 
                   }
                }) 
                if(!isChecked){
                	alert("请至少选择一条新闻");
                }else{
                	alert("删除成功")
                }
            return isChecked; 
            }) 

function delete_new(data,that){
         		if(data){
         			that.parent().parent().parent().remove();
         		}
         }

	var kind="news";
	var ty=undefined;
	/* var sum =$("div.fy").attr("title");  */
	var sum =20;
	var connect_page=0;
	printList(1);
	//类型选择
	$("li.leixing").click(function(){
		$(this).css({"background":"#b2d771","color":"#fff"});
        $(this).siblings('li').css({"background":"#c3c3c5","color":"#000"});
		ty=$(this).attr("title");
		$("div.fy>ul>li").eq(0).trigger("click");
	})

		// 分页及动态写数据	  admin/fenye?html=teac&&type=?&&page=?
		   function printList(index){
		     var fy_html="";
		     var show = sum-index>7?8:sum-index+1;
		     if(index<=connect_page){
		         for(var i=8;i>0;i--){
		             fy_html+="<li>"+(index-i+1)+"</li>";
		         }
		         $(".fy>ul").html(fy_html);
		         $(".fy>ul>li").eq(7).addClass('fy_on');
		     }else{
		         for(var i=0;i<show;i++){
		             fy_html+="<li>"+(index+i)+"</li>";
		         }
		         $(".fy>ul").html(fy_html);
		         $(".fy>ul>li").eq(0).addClass('fy_on');
		     }
		     connect_page=index;
		 }
			    //点击分页  分别触发ajax事件以及分页列表事件
			    $(".fy>ul").delegate('li','click',function(){
			        type=$("#bg_black").attr("title");
			        $(this).addClass('fy_on');
			        $(this).siblings("li").attr("class","");
			        var page = $(this).html();
			        if(sum>8&&(page%7==1)&&page>7){
			            printList(Number(page));
			            }else{
			                connect_page=page;
			            }
			            connect_data(kind,page,ty);
			            console.log(ty);
			            
			        })
			        
			     // 上一页  and 下一页
			$("#pre_page").click(function(){
		     var pre_page=(connect_page-1)%7;
		     pre_page= pre_page==0?7:pre_page;
		     $("div.fy>ul>li").eq(pre_page-1).trigger("click");
		 });
		 
		  $("#next_page").click(function(){
		     var next_page=(Number(connect_page)+1)%7;
		      next_page= next_page==0?7:next_page ;
		      next_page= next_page==1?8:next_page ;
		     $("div.fy>ul>li").eq(next_page-1).trigger("click");
		 }) 
		 
			//拼接ajax地址
		 function connect_data(kind,page,type){
		     type= (type == undefined?"":"&&type="+type);
		     console.log(type);
		     var address ="admin/fenye?html="+kind+type+"&&page="+page;
		     getData(address,printData)
		 }

 // function connect_data(kind,page,type){
 //     type= (type == undefined?"":"&&type="+type);
 //     var address ="admin/fenye?html="+kind+type+"&&page="+page;
 //     getData(address,printNews)
 // }
 // ajax传值取相应数据
 function getData(address,callback,Data,that){

     $.ajax({
         type:"post",
         url:address,
         data:Data,
         dataType:"json",
         success:function(data){
         	 console.log(data);
             callback(data,that);
         },
         error:function(e){
             console.log(e.message);
         }
     });
 }

 function printData(data){
		var news_html="";
		
		$.each(data.paging,function(){
			var that=this.list;
			news_html+="<div class=\"gg\">"+
"		<div>"+
"		"+
"			<p class=\"gg_head\">"+
"				 <span class=\"gg_title\" title="+that[0].n_title+"><b>标题：</b>"+that[0].n_title+"</span><span><b>类别:</b>"+that[2].nt_name+"</span><span><b>时间：</b>"+
"				"+that[0].n_ctime+"</span><input type=\"checkbox\"/><span class=\"gg_bg\"><img src=\"img/ss.png\"></span>"+
"			</p>"+
"			<!-- 各新闻公告的ID -->"+
"			<div class=\"news_detail\">"+
"				<p>"+
"					<b>ID：</b><span>"+that[0].n_id+"</span>"+
"				</p>"+
"				<p>"+
"					<b>简介：</b>"+that[2].nt_explain+
"				</p>"+
"				<p>"+
"					<b>时间：</b>"+that[0].n_ctime+
"				</p>"+
"				<p>"+
"					<b>发布人：</b>"+that[1].a_name+
"				</p>"+
"               <p>"+
"                   <b>内容：</b>"+
"               </p>"+    
"				<input class=\"change_news\" type=\"button\" value=\"修改内容\" title="+that[0].n_id+">"+
"				<div title="+that[2].nt_id+"> "+that[0].n_content+"</div>"+
"			</div>"+
"		</div>"+
"	</div>";
		});
		$("#each_div").html(news_html);
	}
});
</script>
